<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="content-type" content="text/html;charset=utf-8"/>
    <title>Amazing Slider</title>
    
    <!-- Insert to your webpage before the </head> -->
    <script src="sliderengine/jquery.js"></script>
    <script src="sliderengine/amazingslider.js"></script>
    <script src="sliderengine/initslider-1.js"></script>
    <!-- End of head section HTML codes -->
    
</head>
<body>
<div style="margin:30px auto;max-width:600px;">
    
    <!-- Insert to your webpage where you want to display the slider -->
    <div id="amazingslider-1" style="display:block;position:relative;margin:16px auto 56px;">
        <ul class="amazingslider-slides" style="display:none;">
            <li><img src="images/green_bubbles-wide.jpg" alt="green_bubbles-wide" /></li>
            <li><img src="images/Grass-Ripples-green-19839098-1280-1024.jpg" alt="Grass-Ripples-green-19839098-1280-1024" /></li>
            <li><img src="images/Happy-New-year-2014-love-heart-picture.jpg" alt="Happy-New-year-2014-love-heart-picture" /></li>
        </ul>
        <ul class="amazingslider-thumbnails" style="display:none;">
            <li><img src="images/green_bubbles-wide-tn.jpg" /></li>
            <li><img src="images/Grass-Ripples-green-19839098-1280-1024-tn.jpg" /></li>
            <li><img src="images/Happy-New-year-2014-love-heart-picture-tn.jpg" /></li>
        </ul>
        <div class="amazingslider-engine" style="display:none;"><a href="http://amazingslider.com">jQuery Slider</a></div>
    </div>
    <!-- End of body section HTML codes -->
    
</div>
</body>
</html>